<template>
  <view :style="themeColor">
    <view class="page">
      <view class="flex flex-direction flex-wrap align-stretch benben-position-layout flex mygrainStation_flex_0"
        :style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx', }">
        <view class='flex flex-wrap align-center justify-between flex-sub mygrainStation_fd0_0'>
          <view class='flex flex-wrap align-center mygrainStation_fd0_0_c0' @tap.stop="handleJumpDiy" data-type="back"
            data-url="1">
            <text class='fu-iconfont2  mygrainStation_fd0_0_c0_c0'>&#xE794;</text>
          </view>
          <view class='flex flex-wrap align-stretch justify-center'>
            <text class='mygrainStation_fd0_0_c1_c0'>我的粮站</text>
          </view>
          <view class='flex flex-wrap align-center justify-end mygrainStation_fd0_0_c0'>
            <image class='mygrainStation_fd0_0_c2_c0' mode="aspectFit" :src='STATIC_URL+"7.png"'
              @tap.stop="popupShow1706176264645=true"></image>
          </view>
        </view>

      </view>
      <view :style="{height: (88+StatusBarRpx)+'rpx'}"></view>
      <!---flex布局flex布局开始-->
      <view class="flex flex-direction flex-wrap align-center benben-flex-layout mygrainStation_flex_1"
        v-if=" state==0">
        <image class='mygrainStation_fd1_0' mode="aspectFit" :src='STATIC_URL+"15.png"'></image>
        <text class='mygrainStation_fd1_1'>亲！立刻加入粮站，千万客户纷至沓来~</text>
        <button class='mygrainStation_fd1_2' @tap.stop="goConsultation" data-type="navigateTo"
          :data-url="`/pages/wode/notgrainStation/notgrainStation`">立刻加入！</button>
      </view>

      <!---flex布局flex布局结束-->
      <benben-popup v-model="popupShow1706176264645" :mask="true" :mask-close-able="false" mode='bottom' :z-index='999'>
        <!---分享flex布局开始-->
        <view class="flex flex-direction flex-wrap align-stretch benben-flex-layout">
          <view class='flex flex-direction flex-wrap align-stretch mygrainStation_fd2_0'>
            <view class='flex flex-wrap align-center justify-between mygrainStation_fd2_0_c0'>
              <view class='flex flex-wrap align-center mygrainStation_fd2_0_c0_c0'>
              </view>
              <view class='flex flex-wrap align-center justify-center mygrainStation_fd2_0_c0_c1'>
                <image class='mygrainStation_fd2_0_c0_c1_c0' mode="aspectFit" :src='STATIC_URL+"21.png"'></image>
                <text class='mygrainStation_fd2_0_c0_c1_c1'>分享到</text>
                <image class='mygrainStation_fd2_0_c0_c1_c0' mode="aspectFit" :src='STATIC_URL+"22.png"'></image>
              </view>
              <view class='flex flex-wrap align-center mygrainStation_fd2_0_c0_c2'>
                <image class='mygrainStation_fd2_0_c0_c2_c0' mode="aspectFit" :src='STATIC_URL+"174.png"'
                  @tap.stop="popupShow1706176264645=false"></image>
              </view>
            </view>
            <view class='flex flex-wrap align-center justify-around mygrainStation_fd2_0_c1'>
              <view class='flex flex-direction flex-wrap align-center'>
                <image class='mygrainStation_fd2_0_c1_c0_c0' mode="aspectFit" :src='STATIC_URL+"23.png"'></image>
                <text class='mygrainStation_fd2_0_c1_c0_c1'>微信好友</text>
              </view>
              <view class='flex flex-direction flex-wrap align-center'>
                <image class='mygrainStation_fd2_0_c1_c0_c0' mode="aspectFit" :src='STATIC_URL+"24.png"'></image>
                <text class='mygrainStation_fd2_0_c1_c0_c1'>朋友圈</text>
              </view>
            </view>
          </view>
        </view>

        <!---分享flex布局结束-->

      </benben-popup>
      <!---flex布局flex布局开始-->
      <view class="flex flex-direction flex-wrap align-stretch benben-flex-layout mygrainStation_flex_3"
        v-if=" state=='1'">
        <view class='flex flex-wrap align-center mygrainStation_fd3_0'>
          <image class='mygrainStation_fd3_0_c0' mode="aspectFill" :src='info.zhaopaifengmian[0]'></image>
          <view class='flex flex-direction flex-wrap align-stretch flex-sub'>
            <view class='flex flex-wrap align-center justify-between'>
              <text class='mygrainStation_fd3_0_c1_c0_c0'>{{info.xingming}}</text>
              <view class='flex flex-wrap align-center'>
                <text class='mygrainStation_fd3_0_c1_c0_c1_c0'>经营</text>
                <text class='mygrainStation_fd3_0_c1_c0_c1_c0'>{{info.jingyingnianxian}}年</text>
              </view>
            </view>
            <view class='flex flex-wrap align-center mygrainStation_fd3_0_c1_c1'>
              <view class="flex flex-wrap align-center" v-if="info.certified==2">
                <image class='mygrainStation_fd3_0_c1_c1_c0' mode="aspectFit" :src='STATIC_URL+"5.png"'></image>
                <text class='mygrainStation_fd3_0_c1_c1_c1'>已实名</text>
              </view>
              <view class="flex flex-wrap align-center" v-if="info.is_vip">
                <image class='mygrainStation_fd3_0_c1_c1_c0' mode="aspectFit" :src='STATIC_URL+"6.png"'></image>
                <text class='mygrainStation_fd3_0_c1_c1_c3'>VIP会员</text>
              </view>

            </view>
            <view class='flex align-center mygrainStation_fd3_0_c1_c1' v-if="info.weizhi">
              <image class='mygrainStation_fd3_0_c1_c2_c0' mode="aspectFit" :src='STATIC_URL+"20.png"'></image>
              <text class='mygrainStation_fd3_0_c1_c2_c1'>{{info.weizhi}}</text>
            </view>
            <view class='flex flex-wrap align-center mygrainStation_fd3_0_c1_c1'>
              <image class='mygrainStation_fd3_0_c1_c2_c0' mode="aspectFit" :src='STATIC_URL+"29.png"'></image>
              <text class='mygrainStation_fd3_0_c1_c2_c1'>{{info.lianxidianhua}}</text>
            </view>
            <view class='flex flex-wrap align-center mygrainStation_fd3_0_c1_c1'>
              <text class='mygrainStation_fd3_0_c1_c4_c0'>{{info.liangzhan_cate_pid1_text}}
                <text v-if="info.liangzhan_cate_pid2_text">，</text>{{info.liangzhan_cate_pid2_text}} <text
                  v-if="info.liangzhan_cate_pid3_text">，</text>{{info.liangzhan_cate_pid3_text}}</text>
            </view>
            <view class='flex flex-wrap align-end margin-top-sm'>
              <view class=' flex flex-wrap align-center'>
                <view class='flex flex-wrap align-center mygrainStation_fd3_0_c1_c5_c0_c0'
                  v-if="info.liangzhan_cate_pid4_text">
                  <text class='mygrainStation_fd3_0_c1_c5_c0_c0_c0'>{{info.liangzhan_cate_pid4_text}}</text>
                </view>
                <view class='flex flex-wrap align-center mygrainStation_fd3_0_c1_c5_c0_c0'
                  v-if="info.liangzhan_cate_pid5_text">
                  <text class='mygrainStation_fd3_0_c1_c5_c0_c0_c0'>{{info.liangzhan_cate_pid5_text}}</text>
                </view>
                <view class='flex flex-wrap align-center mygrainStation_fd3_0_c1_c5_c0_c0'
                  v-if="info.liangzhan_cate_pid6_text">
                  <text class='mygrainStation_fd3_0_c1_c5_c0_c0_c0'>{{info.liangzhan_cate_pid6_text}}</text>
                </view>
              </view>
              <button class='mygrainStation_fd3_0_c1_c5_c1' @tap.stop="handleJumpDiy" data-type="navigateTo"
                :data-url="`/pages/wode/grainEditing/grainEditing`">编辑</button>
            </view>
          </view>
        </view>
        <view class='flex flex-direction flex-wrap align-stretch mygrainStation_fd3_1'>
          <view class='flex flex-wrap align-center mygrainStation_fd3_1_c0'>
            <text class='mygrainStation_fd3_1_c0_c0'>粮站展示</text>
          </view>
          <view class='flex flex-direction flex-wrap align-center mygrainStation_fd3_1_c1'>
            <image v-for="(item,index) in info.liangzhanhuanjing" @click="prevImage(info.liangzhanhuanjing,index)"
              :key="index" class='mygrainStation_fd3_1_c1_c0' mode="aspectFill" :src='item'></image>

          </view>
        </view>
      </view>

      <!---flex布局flex布局结束-->


    </view>
  </view>
</template>
<script>
  export default {
    components: {},


    data() {
      return {
        "popupShow1706176264645": false,
        "state": "3",
        info: ''
      };
    },
    computed: {
      themeColor() {
        return this.$store.getters.themeColor
      },
      userInfo() {
        return this.$store.state.userInfo
      },
    },
    watch: {},
    onLoad(options) {
      console.log('oooo', this.userInfo)

    },
    onUnload() {

    },
    onReady() {

    },
    onShow() {
      this.getdetail()
    },
    onHide() {

    },
    onResize() {

    },
    onPullDownRefresh() {

    },
    onReachBottom(e) {

    },
    onPageScroll(e) {

    },
    methods: {
      // 是否是会员
      goConsultation(item) {
        this.$api.post(global.apiUrls.post5c78c4772da97).then(res => {
          if (res.data.code == 1) {
            if (res.data.data.is_vip) {
              uni.navigateTo({
                url: `/pages/wode/notgrainStation/notgrainStation`
              })
            } else {
              this.$message.info('请前往充值会员')
              setTimeout(res => {
                uni.navigateTo({
                  url: `/pages/wode/rurchaseMembership/rurchaseMembership`
                })
              }, 500)
            }
          }
        })
      },
      prevImage(list, index) {
        uni.previewImage({
          urls: list,
          current: index
        })
      },
      getdetail() {
        this.$api.post(global.apiUrls.post65d84a4c2a9f6, {
          user_id: this.userInfo && this.userInfo.id
        }).then(res => {
          console.log('ressssssss', res.data.code, )
          if (res.data.code == 1) {
            this.state = 1
            this.info = res.data.data
            // this.info.liangzhancate_mingcheng = this.info.liangzhancate_mingcheng.join(',')
          } else if (res.data.code == '-1') {
            this.state = 0
          }
        })
      },
    }
  };
</script>
<style lang="scss" scoped>
  .page {
    width: 100vw;
    overflow-x: hidden;
    min-height: calc(100vh - var(--window-bottom));
    background: rgba(255, 255, 255, 1);
    background-size: 100% auto;
  }

  .mygrainStation_flex_0 {
    background: rgba(255, 255, 255, 1);
    width: 750rpx;
    height: 88rpx;
    overflow: hidden;
    z-index: 10;
    top: 0rpx;
    background-size: 100% auto;
  }

  .mygrainStation_fd0_0_c2_c0 {
    width: 119rpx;
    height: 55rpx;
    border-radius: 0rpx 0rpx 0rpx 0rpx;
  }

  .mygrainStation_fd0_0_c1_c0 {
    font-size: 36rpx;
    font-weight: 700;
    color: #333333;
    line-height: 50rpx;
  }

  .mygrainStation_fd0_0_c0_c0 {
    font-size: 36rpx;
    color: #333;
  }

  .mygrainStation_fd0_0_c0 {
    width: 120rpx;
  }

  .mygrainStation_fd0_0 {
    padding: 0rpx 32rpx 0rpx 32rpx;
  }

  .mygrainStation_flex_1 {
    padding: 159rpx 0rpx 0rpx 0rpx;
  }

  .mygrainStation_fd1_2 {
    background: rgba(37, 104, 174, 1);
    border-radius: 36rpx;
    width: 320rpx;
    line-height: 72rpx;
    font-size: 28rpx;
    color: #fff;
    margin: 171rpx 0rpx 0rpx 0rpx;
  }

  .mygrainStation_fd1_1 {
    color: #333333;
    font-size: 28rpx;
    font-weight: 700;
    line-height: 32rpx;
    margin: 63rpx 0rpx 0rpx 0rpx;
  }

  .mygrainStation_fd1_0 {
    width: 513rpx;
    height: 308rpx;
    border-radius: 0rpx 0rpx 0rpx 0rpx;
  }

  .mygrainStation_fd2_0_c1_c0_c1 {
    font-size: 24rpx;
    font-weight: 400;
    color: #333;
  }

  .mygrainStation_fd2_0_c1_c0_c0 {
    width: 80rpx;
    height: 80rpx;
    border-radius: 40rpx 40rpx 40rpx 40rpx;
    margin: 0rpx 0rpx 16rpx 0rpx;
  }

  .mygrainStation_fd2_0_c1 {
    padding: 0rpx 0rpx 58rpx 0rpx;
  }

  .mygrainStation_fd2_0_c0_c2_c0 {
    width: 40rpx;
    height: 40rpx;
    border-radius: 20rpx 20rpx 20rpx 20rpx;
  }

  .mygrainStation_fd2_0_c0_c2 {
    margin: 0rpx 2rpx 0rpx 0rpx;
  }

  .mygrainStation_fd2_0_c0_c1_c1 {
    font-size: 32rpx;
    font-weight: 400;
    color: #333333;
    margin: 0rpx 20rpx 0rpx 20rpx;
    line-height: 46rpx;
  }

  .mygrainStation_fd2_0_c0_c1_c0 {
    width: 28rpx;
    height: 10rpx;
    border-radius: 0rpx 0rpx 0rpx 0rpx;
  }

  .mygrainStation_fd2_0_c0_c1 {
    padding: 40rpx 0rpx 48rpx 0rpx;
  }

  .mygrainStation_fd2_0_c0_c0 {
    width: 40rpx;
  }

  .mygrainStation_fd2_0_c0 {
    padding: 0rpx 13rpx 0rpx 0rpx;
  }

  .mygrainStation_fd2_0 {
    background: #fff;
    background-size: 100% auto !important;
    border-radius: 24rpx 24rpx 0rpx 0rpx;
    padding: 0rpx 32rpx 0rpx 32rpx;
  }

  .mygrainStation_flex_3 {
    background: rgba(246, 246, 246, 1);
    background-size: 100% auto;
    padding: 20rpx 0rpx 0rpx 0rpx;
  }

  .mygrainStation_fd3_1_c1_c0 {
    width: 620rpx;
    height: 339rpx;
    border-radius: 0rpx 0rpx 0rpx 0rpx;
    margin: 24rpx 0rpx 0rpx 0rpx;
  }

  .mygrainStation_fd3_1_c1 {
    padding: 0rpx 0rpx 24rpx 0rpx;
  }

  .mygrainStation_fd3_1_c0_c0 {
    color: #333333;
    font-size: 36rpx;
    font-weight: 700;
    line-height: 42rpx;
  }

  .mygrainStation_fd3_1_c0 {
    margin: 32rpx 24rpx 0rpx 24rpx;
  }

  .mygrainStation_fd3_1 {
    background: rgba(255, 255, 255, 1);
    margin: 20rpx 0rpx 0rpx 0rpx;
    background-size: 100% auto;
  }

  .mygrainStation_fd3_0_c1_c5_c1 {
    background: rgba(37, 104, 174, 1);
    border-radius: 10rpx;
    width: 160rpx;
    line-height: 64rpx;
    font-size: 30rpx;
    color: #fff;
    margin: 0rpx 0rpx 0rpx auto;
  }

  .mygrainStation_fd3_0_c1_c5_c0_c0_c0 {
    color: #667D91;
    font-size: 24rpx;
    font-weight: 500;
    line-height: 32rpx;
  }

  .mygrainStation_fd3_0_c1_c5_c0_c0 {
    background: rgba(244, 247, 255, 1);
    padding: 4rpx 14rpx 4rpx 14rpx;
    border-radius: 4rpx;
    background-size: 100% auto;
    margin: 0rpx 24rpx 0rpx 0rpx;
  }

  .mygrainStation_fd3_0_c1_c4_c0 {
    color: #333333;
    font-size: 28rpx;
    font-weight: 400;
    line-height: 32rpx;
  }

  .mygrainStation_fd3_0_c1_c2_c1 {
    color: #333333;
    font-size: 22rpx;
    font-weight: 400;
    line-height: 32rpx;
  }

  .mygrainStation_fd3_0_c1_c2_c0 {
    width: 20rpx;
    height: 25rpx;
    border-radius: 0rpx 0rpx 0rpx 0rpx;
    margin: 0rpx 11rpx 0rpx 0rpx;
  }

  .mygrainStation_fd3_0_c1_c1_c3 {
    color: #C86105;
    font-size: 26rpx;
    font-weight: 400;
    line-height: 32rpx;
  }

  .mygrainStation_fd3_0_c1_c1_c1 {
    color: #C86105;
    font-size: 26rpx;
    font-weight: 400;
    line-height: 32rpx;
    margin: 0rpx 65rpx 0rpx 0rpx;
  }

  .mygrainStation_fd3_0_c1_c1_c0 {
    width: 40rpx;
    height: 40rpx;
    border-radius: 0rpx 0rpx 0rpx 0rpx;
    margin: 0rpx 16rpx 0rpx 0rpx;
  }

  .mygrainStation_fd3_0_c1_c1 {
    margin: 25rpx 0rpx 0rpx 0rpx;
  }

  .mygrainStation_fd3_0_c1_c0_c1_c0 {
    color: #999999;
    font-size: 22rpx;
    font-weight: 400;
    line-height: 32rpx;
  }

  .mygrainStation_fd3_0_c1_c0_c0 {
    color: #101010;
    font-size: 32rpx;
    font-weight: 500;
    line-height: 32rpx;
    width: 318rpx;
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
  }

  .mygrainStation_fd3_0_c0 {
    width: 233rpx;
    height: 350rpx;
    border-radius: 0rpx 0rpx 0rpx 0rpx;
    margin: 0rpx 24rpx 0rpx 0rpx;
  }

  .mygrainStation_fd3_0 {
    background: rgba(255, 255, 255, 1);
    background-size: 100% auto;
    padding: 32rpx 24rpx 32rpx 24rpx;
  }
</style>
